<template>
  <div id="detail-form-con">
    <g-banner title="详情表单(只读列表)" des="用于展示详细信息，一般无需更改的表单"></g-banner>
    <a-affix :target="getScrollingCon">
      <div class="g-title-con">
        <h2 class="g-main-title">详情表单（一列）</h2>
      </div>
    </a-affix>
    <div class="g-box" style="padding: 30px;">
      <div class="g-form-title">消费者表单</div>
      <table class="g-form-detail-item" border="1">
        <tr>
          <td width="200px">名称</td>
          <td>历城区凡超食品商行历城区凡超食品商行历城区凡超食品商行历城区凡超食品商行</td>
        </tr>
        <tr>
          <td>社会用代码（身份证号）</td>
          <td>38701024958595500403</td>
        </tr>
        <tr>
          <td>企业负责人</td>
          <td>董文霞</td>
        </tr>
        <tr>
          <td>住所</td>
          <td>东风街</td>
        </tr>
        <tr>
          <td>经营场所</td>
          <td>济南市历城区祝甸南路66号东临济南市历城区祝甸南路66号东临</td>
        </tr>
        <tr>
          <td>主题业态</td>
          <td>正常</td>
        </tr>
        <tr>
          <td>经营项目</td>
          <td>食品</td>
        </tr>
        <tr>
          <td>销售证状态</td>
          <td>过期</td>
        </tr>
        <tr>
          <td>销售证状态</td>
          <td>过期</td>
        </tr>
      </table>
    </div>
    <a-affix :target="getScrollingCon">
      <div class="g-title-con">
        <h2 class="g-main-title">详情表单（两列）</h2>
      </div>
    </a-affix>
    <div class="g-box" style="padding: 30px;">
      <div class="g-form-title">消费者表单</div>
      <div class="g-form-block-grid">
        <table class="g-form-detail-item" border="1">
          <tr>
            <td width="200px">名称</td>
            <td>历城区凡超食品商行历城区凡超食品商行</td>
          </tr>
          <tr>
            <td>社会用代码（身份证号）</td>
            <td>38701024958595500403</td>
          </tr>
          <tr>
            <td>企业负责人</td>
            <td>董文霞</td>
          </tr>
          <tr>
            <td>住所</td>
            <td>东风街</td>
          </tr>
          <tr>
            <td>经营场所</td>
            <td>济南市历城区祝甸南路66号东临济南市历城区祝甸南路66号东临</td>
          </tr>
          <tr>
            <td>主题业态</td>
            <td>正常</td>
          </tr>
          <tr>
            <td>经营项目</td>
            <td>食品</td>
          </tr>
          <tr>
            <td>销售证状态</td>
            <td>过期</td>
          </tr>
          <tr>
            <td>销售证状态</td>
            <td>过期</td>
          </tr>
        </table>
      </div>
      <div class="g-form-block-grid">
        <table class="g-form-detail-item" border="1">
          <tr>
            <td width="200px">名称</td>
            <td>历城区凡超食品商行历城区凡超食品商行</td>
          </tr>
          <tr>
            <td>社会用代码（身份证号）</td>
            <td>38701024958595500403</td>
          </tr>
          <tr>
            <td>企业负责人</td>
            <td>董文霞</td>
          </tr>
          <tr>
            <td>住所</td>
            <td>东风街</td>
          </tr>
          <tr>
            <td>经营场所</td>
            <td>济南市历城区祝甸南路66号东临济南市历城区祝甸南路66号东临</td>
          </tr>
          <tr>
            <td>主题业态</td>
            <td>正常</td>
          </tr>
          <tr>
            <td>经营项目</td>
            <td>食品</td>
          </tr>
          <tr>
            <td>销售证状态</td>
            <td>过期</td>
          </tr>
          <tr>
            <td>销售证状态</td>
            <td>过期</td>
          </tr>
        </table>
      </div>
    </div>
  </div>
</template>
<script>
import { getScrollingCon } from '@/util/common'
export default {
  methods: {
    getScrollingCon
  }
}
</script>